<ion-header class="ion-header">
    <header-component>
        <ion-toolbar>
            <ion-buttons class="button-left">
                <img navBackButton src="assets/imgs/return.svg" alt="">
            </ion-buttons>
            <ion-title>物联运维</ion-title>
        </ion-toolbar>
    </header-component>
</ion-header>
<ion-content class="iotOperation">
    <!-- <div class="iotOperation-title">
        <div class="title-left">
            <ion-icon (click)="goBack()" name="ios-arrow-back"></ion-icon>
        </div>
        <div class="title-name">物联运维</div>
    </div> -->
    <!-- <nav-title (callback)="goBack()" title="物联运维"></nav-title> -->
    <div class="iotOperation-tab">
        <alarm-tab [functionList]="functionList" (changeAlarmTab)="changeAlarmTab($event)">
        </alarm-tab>
    </div>
    <div class="iotOperation-content">
        <div class="content-top">
            <!-- 图表 -->
            <div class="content-top-chart">
                <div echarts [options]="option" class="chart-content"></div>
                <div (click)='chartItemClick(0)' class="chart-title">
                    <div>总数</div>
                    <span>{{allNum}}</span>
                </div>
            </div>
            <!-- 内容分类 -->
            <div class="content-top-list">
                <div (click)='chartItemClick(item.status)' class="content-top-list-div" *ngFor="let item of chartData">
                    <div class="listTitle">{{item.name}}</div>
                    <span class="listNum">{{item.value}}</span>
                </div>
            </div>
        </div>
        <div class="content-bottom">
            <div class="content-bottom-border"></div>

            <div class="content-bottom-list">
                <!-- <ion-refresher (ionRefresh)="doRefresh($event.target)">
                    <ion-refresher-content pullingText="刷新数据"></ion-refresher-content>
                </ion-refresher> -->
                <alarm-item [alarmDatas]="listData" (showPopup)="showPopup($event)"></alarm-item>
            </div>
        </div>
    </div>
</ion-content>
<ion-footer>
    <div class="data-count">共 <span class="data-count-num">{{listData.length}}</span> 条记录</div>
</ion-footer>